export default {
  data() {
    return {
      request: null,
      pageNo: 1,
      pageSize: 10,
      pageSizes: [10, 20, 50, 100],
      totalSize: 0,
      tableData: [],
      tableColumn: [],
      loading: false,
      dialogValue: false,
      selectOptions: [],
      deleteKey: 'id',
      searchForm: {},
      reseSearchForm: {},
      ruleForm: {},
      reseForm: {},
      rules: {}
    }
  },
  computed: {
    dialogTitle() {
      return this.ruleForm.id ? '编辑' : '添加'
    }
  },
  methods: {
    getPage() {
      this.loading = true
      this.request.page(this.getQueryForm())
        .then((data) => {
          this.pageNo = data.data.pageNum
          this.totalSize = data.data.dataSumNum
          this.formattTableData(data.list)
          this.tableData = data.list
          this.loading = false
        })
        .catch((error) => {
          this.loading = false
          console.info(error)
        })
    },
    formattTableData(tableData) {
      console.log(tableData)
    },
    getQueryForm() {
      const form = {
        ...this.searchForm,
        pageNum: this.pageNo,
        pageSize: this.pageSize
      }
      const _form = {}
      for (const key in form) {
        if (form[key]) {
          _form[key] = form[key]
        }
      }
      return _form
    },
    handleSelectionChange(val) {
      this.selectOptions = val.map((x) => x[this.deleteKey])
    },
    handleChangePageNo(pageNo) {
      this.pageNo = pageNo
      this.getPage()
    },
    handleChangePageSize(pageSize) {
      this.pageSize = pageSize
      this.getPage()
    },
    search() {
      this.pageNo = 1
      this.getPage()
    },
    reset() {
      this.searchForm = { }
      this.search()
    },
    add() {
      this.ruleForm = { ...this.reseForm }
      this.dialogValue = true
    },
    edit(rowItem) {
      console.log(rowItem, this.ruleForm)
      for (const key in this.ruleForm) {
        this.ruleForm[key] = rowItem[key]
      }
      this.ruleForm.id = rowItem.id
      this.dialogValue = true
    },
    deletes(ids) {
      console.log('删除')
      ids = ids || this.selectOptions || []
      if (!ids || !ids.length) return this.$message.error('请选择操作项！')
      this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.request.delete(ids)
            .then((data) => {
              this.play.message(this, data.status, data.errorMsg)
              this.getPage()
            })
            .catch((error) => {
              console.info(error)
            })
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })
    },
    close() {
      this.dialogValue = false
    },
    save() {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          const methodName = this.ruleForm.id ? 'edit' : 'add'
          this.request[methodName]({ ...this.ruleForm })
            .then((data) => {
              this.play.message(this, data.status, data.errorMsg)
              this.search()
              this.dialogValue = false
            })
            .catch((error) => {
              console.info(error)
            })
        }
      })
    }
  }
}
